{% extends "./inc_base.html" %}
{% block middle %}
{% set detail = 'cms_doc'|@findOne({
include : 'cms_doc_article',
where:{classify_id:classify.id,pid:0,status:1},order:[[ 'sort', 'ASC' ]]
})%}
<div class="section pt-4 pb-4">
    <div class="container">
        <div class="row g-xl-5">
            <div class="col-12 col-lg-9 order-2">
                <div class="mb-4">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb small mb-3">
                            {%for item in breadcrumb%}
                            <li class="breadcrumb-item"><a href="{{item.url}}">{{item.name}}</a></li>
                            {%endfor%}
                            <li class="breadcrumb-item">详情</li>
                        </ol>
                    </nav>
                    <h1 class="h3 mb-0">
                        {{detail.title}}
                    </h1>
                    <p class="d-block text-muted small">
                        发布时间: <time
                            datetime="{{helper.moment(detail.createdAt).format('YYYY-MM-DD HH:mm:ss')}}">{{helper.moment(detail.createdAt).format('YYYY-MM-DD
                            HH:mm:ss')}}</time>
                    </p>
                </div>
                <div class="article-format" data-id="{{detail.id}}">
                    {{detail['cms_doc_article.content']|safe}}
                </div>
                <p class="text-muted border-bottom pb-2 small mt-5">
                    最后更新时间: {{helper.moment(detail.updatedAt).format('YYYY-MM-DD HH:mm:ss')}}
                </p>
                {%set tags = detail.tags|split(',')%}
                {%if tags%}
                <!-- Tags and share -->
                <div class="row">
                    <div class="col-12">

                        <h4 class="smaller text-muted">
                            相关标签
                        </h4>
                        {%for item in tags%}
                        <a href="#!" class="text-dark bg-light small rounded py-2 px-3 m-1 text-decoration-none"
                            rel="nofollow">
                            {{item}}
                        </a>
                        {%endfor%}
                    </div>
                </div>
                <!-- /Tags and share -->
                {%endif%}
                <!-- COMMENTS -->
                {%if classify.reply%}
                {% include "./comment_index.html" %}
                {%endif%}
                <!-- /COMMENTS -->
            </div>

            <div class="col-12 col-lg-3 mb-3 order-1">
                <form method="get" action="{{ classify.url }}" class="input-group-over d-block mb-2">
                    <div class="form-floating mb-3">
                        <input
              placeholder="搜索..."
              id="doc_search"
              name="keywords"
              type="text"
              class="form-control"
              value="{{ ctx.query.keywords }}"
            />
            {% if ctx.query.sub %}
                        <input name="sub" type="hidden" value="{{ ctx.query.sub }}" />
            {% endif %}
                        <label for="doc_search">搜索...</label>
                    </div>

                    <button type="submit" class="btn smaller">
            <i class="fi fi-search m-0"></i>
          </button>
                </form>

                <!-- CATEGORIES -->
                <nav
                    class="sticky-kit z-index-0 nav-deep nav-deep-light nav-deep-hover nav-deep-xs mb-3 pb-3 shadow-xs shadow-none-md shadow-none-xs p-0-md p-0-xs rounded">
                    <!-- mobile trigger : categories -->
                    <button
            class="clearfix btn btn-toggle btn-sm w-100 text-align-left shadow-md border rounded mb-1 d-block d-lg-none"
            data-bs-target="#nav_responsive"
            data-toggle-container-class="d-none d-sm-block bg-white shadow-md border animate-fadein rounded"
          >
            <span class="group-icon px-2 py-2 float-start">
              <i class="fi fi-bars-2"></i>
              <i class="fi fi-close"></i>
            </span>
            <span class="h5 py-2 m-0 float-start"> 目录 </span>
          </button>

                    <!-- desktop only -->
                    <h5 class="p-3 m-0 d-none d-lg-block">目录</h5>

                    <!-- navbar : navigation -->
                    <ul id="nav_responsive" class="nav flex-column d-none d-lg-block">
                        {%set nav = 'cms_doc'|@findAll({where:{classify_id:classify.id,pid:0,status:1},order:[[ 'sort',
                        'ASC' ]]})%}
                        {%for n in nav%}
                        {%set _nav = 'cms_doc'|@findAll({where:{classify_id:classify.id,pid:n.id,status:1},order:[[
                        'sort', 'ASC' ]]})%}
                        {%if _nav|length>0%}
                        <li class="nav-item">
                            <a class="nav-link" href="#">
                                <span class="group-icon float-end">
                  <i class="fi fi-arrow-end-slim"></i>
                  <i class="fi fi-arrow-down-slim"></i>
                </span>
                                {{n.title}}
                            </a>
                            <ul class="nav flex-column ps-3">
                                {%for _n in _nav%}
                                {%set __nav =
                                'cms_doc'|@findAll({where:{classify_id:classify.id,pid:_n.id,status:1},order:[[ 'sort',
                                'ASC' ]]})%}
                                {%if __nav|length>0%}
                                <li class="nav-item">
                                    <a class="nav-link" href="#">
                                        <span class="group-icon float-end">
                      <i class="fi fi-arrow-end-slim"></i>
                      <i class="fi fi-arrow-down-slim"></i>
                    </span>
                                        {{_n.title}}
                                    </a>
                                    <ul class="nav flex-column">
                                        {%for __n in __nav%}
                                        <li class="nav-item"><a class="nav-link"
                                                href="/cms/detail/{{__n.id}}">{{__n.title}}</a></li>
                                        {%endfor%}
                                    </ul>
                                </li>
                                {%else%}
                                <li class="nav-item"><a class="nav-link" href="/cms/detail/{{_n.id}}">{{_n.title}}</a>
                                </li>
                                {%endif%}
                                {%endfor%}
                            </ul>
                        </li>
                        {%else%}
                        <li class="nav-item"><a class="nav-link" href="/cms/detail/{{n.id}}">{{n.title}}</a></li>
                        {%endif%}
                        {%endfor%}
                    </ul>
                </nav>
                <!-- /CATEGORIES -->

            </div>
        </div>
    </div>
</div>

{% endblock %}
{%block script%}
<script>
    var id = $('.article-format').data('id');
  //评论
  var cms_comments_callback = function(from,data){
		if(data.status===1000){
          $.SOW.core.toast.show('danger', 'Error', data.msg, 'top-end');
        }else{
          $.SOW.core.toast.show('success', 'Success', data.msg, 'top-end');
          $(from).find('[name="content"]').empty()
					$.SOW.core.ajax_content.__ajaxDivProcess('cms_comments_container', '/cms/comments/ajaxList?doc_id='+id, '#cms_comments_container',$.SOW.core.ajax_content.config.method,null,$.SOW.core.ajax_content.config.callback_function,$.SOW.core.ajax_content.config.callback_before_push);
        }
	}
	var cms_comments_reply_callback = function(from,data){
		if(data.status===1000){
          $.SOW.core.toast.show('danger', 'Error', data.msg, 'top-end');
        }else{
          $.SOW.core.toast.show('success', 'Success', data.msg, 'top-end');
          $(from).find('[name="content"]').empty()
					$('#sow_ajax_modal').modal('hide');
					$.SOW.core.ajax_content.__ajaxDivProcess('cms_comments_container', '/cms/comments/ajaxList?doc_id='+id+'&page='+data.data, '#cms_comments_container',$.SOW.core.ajax_content.config.method,null,$.SOW.core.ajax_content.config.callback_function,$.SOW.core.ajax_content.config.callback_before_push);
        }
	 }
</script>
{%endblock%}